.pages {
    width: 100%;
    height: 100%;
    // background-color: white;
    padding: 10px 0;
    // background-color: white;
    display: flex;
    flex-direction: column;

    :global {


        .header-action {
            width: 100%;
            // height: 60px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 5px 0;
            border-bottom: 1px solid #b4b4b444;

            .select-bucket {}

            .button-action {}
        }

        .center {
            width: 100%;
            flex: 1;
            display: flex;
            padding: 5px;
            display: flex;
            flex-wrap: wrap;
            align-items: start;
            justify-content: flex-start;
            justify-items: start;
            overflow-y: auto;

            .card {
                width: 25%;
                padding: 15px;

                .card-container {
                    width: 100%;
                    height: 185px;
                    background-color: white;
                    box-shadow: 0 0 5px #b4b4b444;
                    border-radius: 5px;
                    position: relative;


                    .card-header {
                        padding: 5px;
                        width: 100%;
                        display: flex;
                        justify-content: space-between;

                        .icon-container {
                            display: inline-block;
                            width: 25px;
                            height: 25px;
                            position: relative;
                            background-color: white;

                            .icon {
                                position: absolute;
                                transform: rotate(45deg);
                                border: 1px solid #b4b4b4;
                                display: inline-block;
                                width: 25px;
                                height: 25px;
                                top: -15px;
                                left: 5px;
                                background-color: white;
                                display: flex;
                                justify-content: center;
                                align-items: center;

                                .icon-svg {
                                    transform: rotate(-45deg);
                                }
                            }
                        }
                    }

                    .card-center-container {
                        width: 100%;
                        padding: 5px;

                        .bucket-name {
                            font-weight: 600;
                            width: 100%;
                            padding: 5px 0;

                        }

                        .bucket-info {
                            padding: 5px 0;
                        }
                    }

                    .create-bucket {
                        position: absolute;
                        cursor: pointer;
                        top: 0;
                        left: 0;
                        height: 100%;
                        width: 100%;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                    }

                    .card-action-container {
                        width: 100%;
                        border-top: 1px solid #b4b4b4;


                        .action-box {
                            width: 100%;
                            display: flex;


                            .action-button {
                                height: 40px;
                                flex: 1;
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                border-right: 1px solid #b4b4b4;

                                &:hover {
                                    background-color: #b4b4b411;
                                    cursor: pointer;
                                }

                            }

                            .action-button:last-child {
                                border-right: none;
                            }
                        }
                    }
                }

            }
        }
    }
}